<template>
	<el-dialog v-model="visible" :title="!dataForm.id ? '新增' : '修改' " :close-on-click-modal='false'
		:close-on-press-escape='false' :fullscreen='true'>
		<el-form :model="dataForm" :rules="dataRule" ref="dataFormRef" label-width="120px" :inline="true">

			<el-form-item label="领用人号" prop="cardid">
				<el-input v-model="dataForm.cardid" placeholder="领用人号" :disabled="!!dataForm.id"
					@keyup.enter.stop="getCardMessage" readonly></el-input>
			</el-form-item>
			<el-form-item label="领用人" prop="recipient">
				<el-input v-model="dataForm.recipient" placeholder="领用人" :disabled="!!dataForm.id" readonly ></el-input>
			</el-form-item>
			<el-form-item label="领用人卡ID" prop="recipientid">
				<el-input v-model="dataForm.recipientid" placeholder="领用人卡ID" @keyup.enter.stop="getCardMessage" ></el-input>
			</el-form-item>
			<el-form-item label="类型" prop="recipienttype">
				<!-- <el-input v-model="dataForm.recipienttype" placeholder="类型"></el-input> -->
				<el-select v-model="dataForm.recipienttype " placeholder="请选择" :disabled="dataForm.status!=0">
					<el-option v-for="item in recipienttypes" :key="item.list" :label="item.listname"
						:value="reString(item.list)">
					</el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="优先级" prop="priority">
				<el-input v-model="dataForm.priority" placeholder="优先级" :disabled="dataForm.status!=0"></el-input>
			</el-form-item>
			<el-form-item label="状态" prop="status">
				<!-- <el-input v-model="dataForm.status" placeholder="状态"></el-input> -->
				<el-select v-model="dataForm.status" placeholder="请选择" disabled>
					<el-option v-for="item in recipientstatus" :key="item.list" :label="item.listname"
						:value="reString(item.list)">
					</el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="物料编码" prop="sku">
				<!-- <el-input v-model="dataForm.sku" placeholder="物料编码" @change="getSkuFn"></el-input> -->
				<el-input v-model="dataForm.sku" placeholder="物料编码" @click="openInventoryDialogHandle()" readonly
					:disabled="dataForm.status!=0"></el-input>
			</el-form-item>
			<el-form-item label="物料名称" prop="descr">
				<!-- <el-input v-model="dataForm.descr" placeholder="物料名称"  @click="outerVisible = true"   readonly ></el-input> -->
				<el-input v-model="dataForm.descr" placeholder="物料名称" @click="openInventoryDialogHandle()" readonly
					:disabled="dataForm.status!=0"></el-input>
			</el-form-item>

			<el-form-item label="计量编码/工装号" prop="">
				<!-- <el-input v-model="dataForm.descr" placeholder="物料名称"  @click="outerVisible = true"   readonly ></el-input> -->
				<el-input v-model="dataForm.factorycdoe" placeholder="计量编码/工装号" @click="openInventoryDialogHandle()"
					readonly :disabled="dataForm.status!=0"></el-input>
			</el-form-item>
			<!-- <el-form-item label="预期数量" prop="preqty">
            <el-input v-model="dataForm.preqty" placeholder="预期数量"></el-input>
          </el-form-item> -->

			<!-- <el-form-item label="领用时间" prop="recipienttime">
            <el-input v-model="dataForm.recipienttime" placeholder="领用时间"></el-input>
          </el-form-item>
          <el-form-item label="发布人" prop="issuer">
            <el-input v-model="dataForm.issuer" placeholder="发布人"></el-input>
          </el-form-item> -->
			<el-form-item label="批号" prop="lot">
				<el-input v-model="dataForm.lot" placeholder="批号" @click="openInventoryDialogHandle()" readonly
					:disabled="dataForm.status!=0">
				</el-input>
			</el-form-item>
			<el-form-item label="自库位" prop="fromloc">
				<el-input v-model="dataForm.fromloc" placeholder="自库位" @click="openInventoryDialogHandle()" readonly
					:disabled="dataForm.status!=0">
				</el-input>
			</el-form-item>
			<el-form-item label="自箱" prop="fromtray">
				<el-input v-model="dataForm.fromtray" placeholder="自箱" @click="openInventoryDialogHandle()" readonly
					:disabled="dataForm.status!=0">
				</el-input>
			</el-form-item>
			<el-form-item label="自格" prop="frombox">
				<!-- <el-input v-model="dataForm.frombox" placeholder="自格" @click="openInventoryDialogHandle()" readonly>
				</el-input> -->
				<el-select v-model="dataForm.frombox" placeholder="请选择" disabled>
					<el-option v-for="item in boxs" :key="item.list" :label="item.listname" :value="item.list">
					</el-option>
				</el-select>
			</el-form-item>

			<el-form-item label="数量" prop="qty">
				<el-input v-model="dataForm.qty" placeholder="数量" onkeyup="value=value.replace(/[^0-9.]/g,'')">
				</el-input>
			</el-form-item>
			<!-- <el-form-item label="当前库位" prop="loc">
            <el-input v-model="dataForm.loc" placeholder="当前库位"></el-input>
          </el-form-item>
          <el-form-item label="当前托盘" prop="tray">
            <el-input v-model="dataForm.tray" placeholder="当前托盘"></el-input>
          </el-form-item>
          <el-form-item label="当前箱号" prop="box">
            <el-input v-model="dataForm.box" placeholder="当前箱号"></el-input>
          </el-form-item>
          <el-form-item label="至库位" prop="toloc">
            <el-input v-model="dataForm.toloc" placeholder="至库位"></el-input>
          </el-form-item>
          <el-form-item label="至托盘" prop="totray">
            <el-input v-model="dataForm.totray" placeholder="至托盘"></el-input>
          </el-form-item>
          <el-form-item label="至箱号" prop="tobox">
            <el-input v-model="dataForm.tobox" placeholder="至箱号"></el-input>
          </el-form-item> -->
			<!--  <el-form-item label="仓库" prop="warehouse">
            <el-input v-model="dataForm.warehouse" placeholder="仓库"></el-input>
          </el-form-item> -->
			<!-- <el-form-item label="部门" prop="department">
				<el-input v-model="dataForm.department" placeholder="部门" :disabled="dataForm.status!=0" ></el-input>
			</el-form-item> -->
			<el-form-item label="备用字段1" prop="reserve1">
				<el-input v-model="dataForm.reserve1" placeholder="备用字段1"></el-input>
			</el-form-item>
			<el-form-item label="备用字段2" prop="reserve2">
				<el-input v-model="dataForm.reserve2" placeholder="备用字段2"></el-input>
			</el-form-item>
			<el-form-item label="备用字段3" prop="reserve3">
				<el-input v-model="dataForm.reserve3" placeholder="备用字段3"></el-input>
			</el-form-item>
			<el-form-item label="备用字段4" prop="reserve4">
				<el-input v-model="dataForm.reserve4" placeholder="备用字段4"></el-input>
			</el-form-item>
			<el-form-item label="备用字段5" prop="reserve5">
				<el-input v-model="dataForm.reserve5" placeholder="备用字段5"></el-input>
			</el-form-item>
			<!-- <el-form-item label="创建人" prop="adduser">
            <el-input v-model="dataForm.adduser" placeholder="创建人"></el-input>
          </el-form-item>
          <el-form-item label="创建时间" prop="addtime">
            <el-input v-model="dataForm.addtime" placeholder="创建时间"></el-input>
          </el-form-item>
          <el-form-item label="更新人" prop="updatuser">
            <el-input v-model="dataForm.updatuser" placeholder="更新人"></el-input>
          </el-form-item>
          <el-form-item label="更新时间" prop="updatetime">
            <el-input v-model="dataForm.updatetime" placeholder="更新时间"></el-input>
          </el-form-item> -->
		</el-form>
		<template #footer>
			<el-button @click="visible = false">取消</el-button>
			<el-button type="primary" @click="dataFormSubmitHandle()">确定</el-button>
		</template>
		<InventoryDialog v-if="dialogInventoryVisible" ref="InventoryDialogVue"
			@filllineInventory="fillLinebyInventory">
		</InventoryDialog>
	</el-dialog>

	<el-dialog v-model="outerVisible" title="物料选择">
		<el-form :inline="true" :model="skuDataForm" @keyup.enter.native="getDataList()">
			<el-form-item>
				<el-input v-model="skuDataForm.descr" placeholder="物料名称" clearable></el-input>
			</el-form-item>
			<el-form-item>
				<el-button @click="getDataList()">查询</el-button>
			</el-form-item>
		</el-form>
		<el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle"
			@sort-change="dataListSortChangeHandle" style="width: 100%;">
			<el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column>
			<el-table-column prop="sku" label="物料编码" header-align="center" align="center"></el-table-column>
			<el-table-column prop="descr" label="物料名称" header-align="center" align="center"></el-table-column>
			<el-table-column prop="pack" label="包装" header-align="center" align="center"></el-table-column>
			<el-table-column prop="sort" label="分类" header-align="center" align="center"></el-table-column>
			<el-table-column prop="unit" label="单位" header-align="center" align="center"></el-table-column>
			<el-table-column prop="weight" label="重量" header-align="center" align="center"></el-table-column>
			<el-table-column prop="length" label="长度" header-align="center" align="center"></el-table-column>
			<el-table-column prop="width" label="宽度" header-align="center" align="center"></el-table-column>
			<el-table-column prop="height" label="高度" header-align="center" align="center"></el-table-column>
			<el-table-column prop="lotrule" label="批次规则" header-align="center" align="center"></el-table-column>
			<el-table-column prop="isuniquecode" label="唯一码管理" header-align="center" align="center"></el-table-column>
			<el-table-column prop="status" label="物料状态" header-align="center" align="center"></el-table-column>
			<el-table-column label='操作' fixed="right" header-align="center" align="center" width="150">
				<template #default="scope">
					<el-button type="text" size="small" @click="outerVisible = false">取 消</el-button>
					<el-button type="text" size="small" @click="dataCommit(scope.row.id)">确定</el-button>
				</template>
			</el-table-column>
		</el-table>
		<el-pagination :current-page="page" :page-sizes="[10, 20, 50, 100]" :page-size="limit" :total="total"
			layout="total, sizes, prev, pager, next, jumper" @size-change="pageSizeChangeHandle"
			@current-change="pageCurrentChangeHandle">
		</el-pagination>
	</el-dialog>
</template>

<script>
	import DataList from "@/utils/DataList";
	import {
		ref,
		reactive,
		onMounted,
		nextTick,
		computed
	} from 'vue';
	import {
		getRecipientsById,
		putRecipients,
		postRecipients
	} from "@/network/lswms/recipient/Recipients"
	import {
		getRecipientsinfoByParams
	} from '@/network/lswms/recipient/Recipientsinfo.js'
	import {
		getCodeListByCode
	} from "@/network/lswms/base/Codelist.js"
	import {
		ElMessage
	} from 'element-plus'
	import _ from 'lodash'
	import InventoryDialog from "@/components/lswms/stock/InventoryDialog1"
	import {
		getSkuById,
		getSkuByCode
	} from "../../../network/lswms/base/Sku";
	import {
		request
	} from "@/network/request";
	export default {
		name: "recipientsAddOrUpdate",
		emits: ["refreshDataList"],
		components: {
			InventoryDialog
		},
		setup(props, {
			emit
		}) {
			const {
				mixinViewModuleOptions,
				order,
				orderField,
				dataList,
				total,
				page,
				limit,
				dataListLoading,
				dataListSelectionChangeHandle,
				dataListSortChangeHandle,
				pageSizeChangeHandle,
				pageCurrentChangeHandle,
				addOrUpdateHandle,
				deleteHandle,
				exportHandle,
				addOrUpdateVisible,
				dataListSelections,
				addOrUpdate
			} = DataList();
			const skuDataForm = ref({
				descr: ''
			})
			onMounted(() => {
				mixinViewModuleOptions.value.getDataListIsPage = true;
				mixinViewModuleOptions.value.getDataListURL = '/lswms/sku/page';
				mixinViewModuleOptions.value.deleteURL = '/lswms/sku';
				mixinViewModuleOptions.value.exportURL = '/lswms/sku/export';
				mixinViewModuleOptions.value.deleteIsBatchKey = 'id';
				mixinViewModuleOptions.value.deleteIsBatch = true
				if (mixinViewModuleOptions.value.activatedIsNeed) {
					getDataList();
				}

			})
			const getDataList = () => {
				dataListLoading.value = false;

				request({
					url: mixinViewModuleOptions.value.getDataListURL,
					method: 'get',
					params: _.merge({
						order: order.value,
						orderField: orderField.value,
						page: mixinViewModuleOptions.value.getDataListIsPage ? page.value : null,
						limit: mixinViewModuleOptions.value.getDataListIsPage ? limit.value : null
					}, skuDataForm.value)

				}).then(function(res) {

					dataListLoading.value = false;
					if (res.code != 0) {
						dataList.value = [];
						total.value = 0;
						return ElMessage.error(res.msg);
					}
					dataList.value = mixinViewModuleOptions.value.getDataListIsPage ? res.data.list : res.data;
					if (res.data.param) {
						skuDataForm.value = res.data.param;
					}
					total.value = mixinViewModuleOptions.value.getDataListIsPage ? res.data.total : 0;
				}).catch(function() {
					dataListLoading.value = false;
				})
			}

			const visible = ref(false);
			const dataForm = ref({
				id: '',
				recipientkey: '',
				cardid: '',
				recipientid: '',
				recipient: '',
				recipienttype: '',
				priority: '0',
				status: 0,
				sku: '',
				preqty: '',
				qty: 0,
				recipienttime: '',
				issuer: '',
				lot: '',
				fromloc: '',
				fromtray: '',
				frombox: '',
				loc: '',
				tray: '',
				box: '',
				toloc: '',
				totray: '',
				tobox: '',
				warehouse: '',
				department: '',
				reserve1: '',
				reserve2: '',
				reserve3: '',
				reserve4: '',
				reserve5: '',
				adduser: '',
				addtime: '',
				updatuser: '',
				updatetime: ''

			});


			const dataRule = reactive({
				cardid: [{
					required: true,
					message: '必填项不能为空',
					trigger: 'blur'
				}],
				// recipientid: [{
				// 	required: true,
				// 	message: '必填项不能为空',
				// 	trigger: 'blur'
				// }],
				recipient: [{
					required: true,
					message: '必填项不能为空',
					trigger: 'blur'
				}],
				recipienttype: [{
					required: true,
					message: '必填项不能为空',
					trigger: 'blur'
				}],
				/*  priority: [
				    { required: true, message: '必填项不能为空', trigger: 'blur' }
				  ],  */
				status: [{
					required: true,
					message: '必填项不能为空',
					trigger: 'blur'
				}],
				sku: [{
					required: true,
					message: '必填项不能为空',
					trigger: 'blur'
				}],
				/*       preqty: [
				         { required: true, message: '必填项不能为空', trigger: 'blur' }
				       ],  */
				qty: [{
					required: true,
					message: '必填项不能为空',
					trigger: 'blur'
				}],
				/*       recipienttime: [
				         { required: true, message: '必填项不能为空', trigger: 'blur' }
				       ],          issuer: [
				         { required: true, message: '必填项不能为空', trigger: 'blur' }
				       ],    */
				lot: [{
					required: true,
					message: '必填项不能为空',
					trigger: 'blur'
				}],
				fromloc: [{
					required: true,
					message: '必填项不能为空',
					trigger: 'blur'
				}],
				fromtray: [{
					required: true,
					message: '必填项不能为空',
					trigger: 'blur'
				}],
				frombox: [{
					required: true,
					message: '必填项不能为空',
					trigger: 'blur'
				}],
				/*    loc: [
				         { required: true, message: '必填项不能为空', trigger: 'blur' }
				       ],          tray: [
				         { required: true, message: '必填项不能为空', trigger: 'blur' }
				       ],          box: [
				         { required: true, message: '必填项不能为空', trigger: 'blur' }
				       ],          toloc: [
				         { required: true, message: '必填项不能为空', trigger: 'blur' }
				       ],          totray: [
				         { required: true, message: '必填项不能为空', trigger: 'blur' }
				       ],          tobox: [
				         { required: true, message: '必填项不能为空', trigger: 'blur' }
				       ],          warehouse: [
				         { required: true, message: '必填项不能为空', trigger: 'blur' }
				       ],          department: [
				         { required: true, message: '必填项不能为空', trigger: 'blur' }
				       ],          reserve1: [
				         { required: true, message: '必填项不能为空', trigger: 'blur' }
				       ],          reserve2: [
				         { required: true, message: '必填项不能为空', trigger: 'blur' }
				       ],          reserve3: [
				         { required: true, message: '必填项不能为空', trigger: 'blur' }
				       ],          reserve4: [
				         { required: true, message: '必填项不能为空', trigger: 'blur' }
				       ],          reserve5: [
				         { required: true, message: '必填项不能为空', trigger: 'blur' }
				       ],          adduser: [
				         { required: true, message: '必填项不能为空', trigger: 'blur' }
				       ],          addtime: [
				         { required: true, message: '必填项不能为空', trigger: 'blur' }
				       ],          updatuser: [
				         { required: true, message: '必填项不能为空', trigger: 'blur' }
				       ],          updatetime: [
				         { required: true, message: '必填项不能为空', trigger: 'blur' }
				       ] */
			})

			const dataFormRef = ref(null)

			const init = () => {
				visible.value = true;
				recipienttypesFn();
				recipientstatusFn();
				boxsFn();
				nextTick(function() {
					dataFormRef.value.resetFields();
					dataFormRef.value.descr = "";
					if (dataForm.value.id) {
						getrecipientsInfo();
					}

				})
			}

			const getrecipientsInfo = () => {
				getRecipientsById(dataForm.value.id).then(function(res) {
					if (res.code != 0) {
						return ElMessage.error(res.msg);
					}
					dataForm.value = _.assignIn({}, dataForm.value, res.data);
				}).catch((err) => {});
			}

			const dialogInventoryVisible = ref(false);
			const InventoryDialogVue = ref(null);
			const openInventoryDialogHandle = () => {
				// if (dataForm.value.sku == "") {
				// 	return ElMessage.error("请先选择领用的物料");
				// }
				dialogInventoryVisible.value = true;
				nextTick(function() {
					//InventoryDialogVue.value.dataForm.sku = dataForm.value.sku;
					InventoryDialogVue.value.init();
				})
			}

			const fillLinebyInventory = (inventoryRow) => {
				dataForm.value.sku = inventoryRow.sku;
				dataForm.value.descr = inventoryRow.descr;
				dataForm.value.factorycdoe = inventoryRow.factorycdoe;
				dataForm.value.lot = inventoryRow.lot;
				dataForm.value.fromloc = inventoryRow.location;
				dataForm.value.fromtray = inventoryRow.tray;
				dataForm.value.frombox = inventoryRow.box;
				dataForm.value.qty = inventoryRow.qty - inventoryRow.pickqty;
				dataForm.value.department = inventoryRow.lot7;
				let isconsumable = inventoryRow.isconsumable;
				if (isconsumable == 1) {
					dataForm.value.recipienttype = 'RECEIVE'
				} else {
					dataForm.value.recipienttype = 'BORROW'
				}
			}

			//获取领用人信息
			const getCardMessage = () => {
				let data = {
					cardid: dataForm.value.cardid,
					recipientid: dataForm.value.recipientid
				}
				
				getRecipientsinfoByParams(data).then((res) => {
					if (res.code != 0) {
						//dataForm.value.recipientid = '';
						dataForm.value.recipient = '';
						return ElMessage.error(res.msg);
					}
						dataForm.value.cardid = res.data.cardid;
					dataForm.value.recipientid = res.data.recipientid;
					dataForm.value.recipient = res.data.recipient;
				})

			}


			const recipienttypes = ref("");

			const recipienttypesFn = () => {

				getCodeListByCode('RECIPIENTTYPE').then((res) => {
					if (res.code != 0) {
						return ElMessage.error(res.msg);
					}
					recipienttypes.value = res.data;
				}).catch((err) => {});
			}

			const boxs = ref("");
			const boxsFn = () => {

				getCodeListByCode('BOXLIST').then((res) => {
					if (res.code != 0) {
						return ElMessage.error(res.msg);
					}
					boxs.value = res.data;
				}).catch((err) => {});
			}

			const getSkuFn = () => {
				let sku = dataForm.value.sku;
				if (!sku) {
					return ElMessage.error("请输入物料码");
				}

				getSkuByCode(sku).then((res) => {
					if (res.code != 0) {

						return ElMessage.error(res.msg);
					}
					dataForm.value.sku = res.data.sku
					dataForm.value.descr = res.data.descr
					dataForm.value.pack = res.data.pack
					dataForm.value.sort = res.data.sort
					dataForm.value.unit = res.data.unit
					dataForm.value.weight = res.data.weight
					dataForm.value.length = res.data.length
					dataForm.value.width = res.data.width
					dataForm.value.lotrule = res.data.lotrule
					dataForm.value.isuniquecode = res.data.isuniquecode

					dataForm.value.lot = '';
					dataForm.value.fromloc = '';
					dataForm.value.fromtray = '';
					dataForm.value.frombox = '';
					dataForm.value.qty = 0;
				}).catch()
			}

			// 获取状态
			const recipientstatus = ref("");
			const recipientstatusFn = () => {
				getCodeListByCode('RECIPIENTSTATUS').then((res) => {
					if (res.code != 0) {
						return ElMessage.error(res.msg);
					}
					recipientstatus.value = res.data;
				}).catch((err) => {});
			}

			const outerVisible = ref(false)
			const dataCommit = (val) => {
				getSkuById(val).then((res) => {
					dataForm.value.sku = res.data.sku
					dataForm.value.descr = res.data.descr
					dataForm.value.pack = res.data.pack
					dataForm.value.sort = res.data.sort
					dataForm.value.unit = res.data.unit
					dataForm.value.weight = res.data.weight
					dataForm.value.length = res.data.length
					dataForm.value.width = res.data.width
					dataForm.value.lotrule = res.data.lotrule
					dataForm.value.isuniquecode = res.data.isuniquecode
					dataForm.value.allocationstrategy = res.data.allocationstrategy
					dataForm.value.rolateby = res.data.rolateby
					outerVisible.value = false

				})
			}


			// 表单提交
			const dataFormSubmitHandle = _.debounce(() => {
				dataFormRef.value.validate(function(valid) {
					if (!valid) {
						return false;
					}

					let qing = () => {
						return !dataForm.value.id ? postRecipients(dataForm.value) : putRecipients(
							dataForm.value)
					}
					qing().then(function(res) {
						if (res.code != 0) {
							return ElMessage.error(res.msg);
						}
						ElMessage({
							message: '操作成功',
							type: 'success',
							duration: 500,
							onClose: function() {
								visible.value = false
								emit('refreshDataList')
							}
						})
					}).catch(function() {});

				})
			}, 1000, {
				'leading': true,
				'trailing': false
			})

			return {
				visible,
				dataForm,
				dataRule,
				init,
				dataFormSubmitHandle,
				dataFormRef,

				dialogInventoryVisible,
				InventoryDialogVue,
				openInventoryDialogHandle,
				fillLinebyInventory,
				getCardMessage,
				recipienttypes,
				getSkuFn,
				recipientstatus,
				boxs,
				dataCommit,
				outerVisible,

				mixinViewModuleOptions,
				order,
				orderField,
				dataList,
				total,
				page,
				limit,
				dataListLoading,
				dataListSelectionChangeHandle,
				dataListSortChangeHandle,
				pageSizeChangeHandle,
				pageCurrentChangeHandle,
				addOrUpdateHandle,
				deleteHandle,
				exportHandle,
				addOrUpdateVisible,
				dataListSelections,
				addOrUpdate,
				getDataList,
				skuDataForm
			}
		},
		methods: {
			reString: function(val) {
				let n = Number(val)
				if (!isNaN(n)) {
					return n
				} else {
					return val
				}
			}
		}

	}
</script>

<style scoped>

</style>
